<!--
 * @LastEditTime: 2022-11-08 16:02:51
 * @FilePath: \pyy_2022-11-3_18-00\src\views\Home.vue
 * @Description  : 首页
-->
<template>
  <div id="home">
    <van-nav-bar title="首页" />
    <div class="container">
      <div
        class="menu-list_item"
        v-for="item in menuList"
        :key="item.url"
        @click="$router.push(item.url)"
      >
        <svg-icon class="img" :name="item.icon" />
        <div class="title">{{ item.name }}</div>
        <svg-icon class="right-icon" name="arrow_right" />
      </div>
    </div>
</div>
</template>

<script>
import { Toast } from "vant";
import api from "../http/api";

export default {
  name: "Home",
  data() {
    return {
      menuList: [
        {
          icon: "demand",
          name: "需求计划",
          url: "/demand",
        },
        {
          icon: "purchase",
          name: "采购询价比",
          url: "/purchase",
        },
        {
          icon: "query",
          name: "科技查新",
          url: "/intelligenceInquiry",
        },
        // {
        //   icon: "physics",
        //   name: "物理分析",
        //   url: "/physics",
        // },
        // {
        //   icon: "chemistry",
        //   name: "化学分析",
        //   url: "/chemistry",
        // },
        {
          icon: "instandhaltung",
          name: "设备维修",
          url: "/instandhaltung",
        },
        {
          icon: "equipment",
          name: "设备计量",
          url: "/equipment",
        },
      ],
      appid: "wx508e48bcec32e941",
    };
  },
  created() {
    this.verifyCode(); //上线用
      // this.setItem('phone','15181798337');
      // this.setItem('userId','221122');
  },
  methods: {
      setItem(key, value) {
          localStorage.setItem(key,value);
      },
      /**
     * code校验
     */
    verifyCode() {
      let code = this.getUrlKey("code");
      if (!code) return this.getCode();
      console.log('code的值为 :>> ', code);
      api.user.getUserIdentify({ code }).then((res) => {
        console.log('code校验',res);
        if (res.data.code == 200) {
          localStorage.userId = res.data.data.openid;
          if (!res.data.data.phone) {
            // Toast.fail("您还没绑定手机号，请进行手机号绑定");
            this.$router.push("/tel");
          } else {
            localStorage.frameToken = res.data.data.frameToken;
            localStorage.phone = res.data.data.phone;
          }
        }
      });
    },
    /**
     * 获取 code
     */
    getCode() {
      //获取code
      let urlNow = encodeURIComponent(window.location.href);
      // let urlNow = 'http://5rnfooqssg3eshsh3.neiwangyun.net';
      // 下面这个上线用
      let url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx508e48bcec32e941&redirect_uri=${urlNow}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`;
      // let url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx36c771c7e2167bf3&redirect_uri=${urlNow}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`;
      window.location.href = url;
    },

    /**
     * 通过 key 获取url中的参数
     * @param {string} name: 参数名(key)
     * @return {any} 读取结果
     */
    getUrlKey: function (name) {
      //获取url 参数
      return (
        decodeURIComponent(
          (new RegExp("[?|&]" + name + "=" + "([^&;]+?)(&|#|;|$)").exec(
            location.href
          ) || [, ""])[1].replace(/\+/g, "%20")
        ) || null
      );
    },
  },
};
</script>

<style lang="less" scoped>
#home {
  width: 100vw;
  height: 100vh;
  background-color: #f5f5f5;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;

  /deep/ .van-nav-bar {
    .van-nav-bar__content {
      height: 51px;

      .van-nav-bar__title {
        font-family: "Inter";
        font-style: normal;
        font-weight: 600;
        font-size: 18px;
        line-height: 20px;
        text-align: center;
        letter-spacing: -0.24px;
        color: #333333;
      }

      .van-ellipsis {
        overflow: visible;
      }
    }
  }

  .container {
    height: 0;
    flex: 1;
    overflow-y: auto;
    box-sizing: border-box;
    padding: 0 8px;

    .menu-list_item {
      height: 64px;
      background-color: white;
      border-radius: 5px;
      display: flex;
      align-items: center;
      margin: 8px 0;
      font-size: 20px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      cursor: pointer;

      .svg-icon {
        margin: 0 22px;
        width: 50px;
        height: 50px;
      }

      .title {
        width: 0;
        flex: 1;
        text-align: left;
        font-family: "Inter";
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 20px;
        letter-spacing: -0.24px;
        color: #333333;
      }

      .right-icon {
        width: 10px;
        height: 10px;
        margin-right: 34px;
      }
    }
  }
}
</style>
